<template>
  <view class="container">
    <text style="font-size: 32rpx; color: #222">{{ select.text }}</text>
    <view class="input">
      <input v-if="type == 1" v-model="nickname" type="text" :placeholder="select.name" />
      <input v-else v-model="wechat" type="text" :placeholder="select.name" />
    </view>
    <button @click="btn">保存</button>
  </view>
</template>

<script>
import { profile, infor } from '@/utils/my.js';
export default {
  data() {
    return {
      type: '',
      list: [
        { text: '昵称', name: '马小跳' },
        { text: '我的微信号', name: '请填写微信号' }
      ],
      select: '',
      type: '',
      nickname: '',
      wechat: '',
      userInfor: ''
    };
  },
  onLoad(options) {
    if (options.type == 1) {
      this.type = options.type;
      this.select = this.list[0];
      uni.setNavigationBarTitle({
        title: '昵称'
      });
    } else {
      this.type = options.type;
      this.select = this.list[1];
      uni.setNavigationBarTitle({
        title: '交换微信'
      });
    }
  },
  async onShow() {
    const res = await infor();
    this.userInfor = res.data;
    if (this.type == 1) {
      this.list[0].name = this.userInfor.nickname;
    } else {
      this.list[1].name = this.userInfor.wechat;
    }
  },
  methods: {
    async btn() {
      if (this.type == 1) {
        // 换昵称
        await profile({ nickname: this.nickname });
      } else {
        let reg = /^[-_a-zA-Z0-9]{6,19}$/;

        if (!reg.test(this.wechat)) {
          return uni.showToast({
            title: '微信号由20位数字和字母组成',
            icon: 'none'
          });
        }
        // 换微信号
        await profile({ wechat: this.wechat });
      }
      uni.showToast({
        title: '修改成功',
        icon: 'none'
      });
      setTimeout(function () {
        uni.redirectTo({
          url: '/my/selfData/selfData'
        });
      }, 200);
    }
  }
};
</script>

<style lang="scss">
.container {
  padding: 30rpx;
  .input {
    width: 100%;
    height: 110rpx;
    background-color: #edeff2;
    border-radius: 55rpx;
    margin-top: 40rpx;
    input {
      width: 86%;
      height: 110rpx;
      margin-left: 40rpx;
    }
  }
  button {
    height: 92rpx;
    background-color: #feff01;
    border-radius: 46rpx;
    margin-top: 120rpx;
  }
}
</style>
